<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>登陆</title>
  <link rel="stylesheet" href="css/bootstrap.min.css"/>
</head>
<body>
<p><h4 id="error"></h4></p>
<p>账号：<input type="text" name="username" id="username" value="lgbooook@gmail.com"/></p>
<p>密码：<input type="password" name="password" id="password" value="123456"/></p>
<p><img src="/captcha.jpg" alt="验证码" style="height:30px;" title="点击更换" class="captcha"/>
  <input type="text" placeholder="验证码" name="captcha" id="captcha"/></p>
<p><input type="button" id="login" value="登录"/></p>
<script src="libs/jquery.min.js"></script>
<script src="js/common.js"></script>
<script language="javascript" type="text/javascript">
    $(function () {
        $('.captcha').click(function () {
            this.src = '/captcha.jpg?t=' + $.now();
        });

        $('#login').click(function () {
            $("#error").html('');
            $.ajax({
                url : 'login',
                type : 'post',
                data : {'username':$('#username').val(),
                    'password':$('#password').val(),
                    'captcha':$('#captcha').val()},
                success : function (data) {
                    if (data == 401) {
                        $("#error").html('权限不足');
                    } else if (data.state){
                        localStorage.setItem("token", data.data);
                        location.href = "/main.html";
                    } else {
                        $("#error").html(data.message);
                        $('.captcha').attr('src', '/captcha.jpg?t=' + $.now());
                    }
                }
            });
        });
    });
</script>
</body>
</html>